You can work
more efficiently in Macromedia Dreamweaver by creating custom objects for
the Objects panel. Simple custom objects, which add HTML code to your
documents, function similarly to Library items. One possible advantage
that a custom object might have over a Library item is that the custom
object—as part of the user interface—is always easily accessible while
Dreamweaver is running. Adding simple custom objects basically involves
saving the desired HTML code (and does not involve creating any JavaScript
files), which streamlines the process.
Creating a simple
custom object for the Objects panel To add a simple custom
object, you first create an HTML page in Dreamweaver and then design an
accompanying GIF image in an image editing program, such as Fireworks or
FreeHand. Both of these files must be saved in the same folder, as
outlined below:
Creating the HTML file
1
Open a new
document.
2
In Code
view, remove all HTML tags (including the <html>, <head> and
<body>
tags). The background color in the Document window will be
gray.
3
Add the desired HTML code to create your object. You
could, for example, add code similar to:
Choose File > Save As to open the Save As dialog
box. In this dialog box, you will have to decide whether this
object should appear on one of the existing categories of the
Object panel (such as Common or Forms) or on a new category
that you create. You will make this choice by saving the page
into an existing Dreamweaver application folder or by creating
a new folder (details below).
For an object to appear in an existing
category: In the Save As dialog box, navigate to the
Dreamweaver 4 > Configuration > Objects folder.
Save the HTML into one of the existing category folders
in the Objects folder (such as the Common folder).
For an object to appear in a new category:
In the Save As dialog box, navigate to the
Dreamweaver 4 > Configuration > Objects folder.
Create a new folder inside of the Objects folder. Save
your HTML file into this newly-created subfolder. The
name you choose for the subfolder will be the name of
the category on the Objects panel.
Note:
Additional folders created within subfolders of the
Objects folder will not be recognized.
(To see the other categories on the Objects panel,
click Common (or whichever category name appears) at the top
of the panel. Each of these category names are, in fact,
subfolders in the Objects folder (see Example 2). By creating your own
subfolder in the Objects folder, you can add to this list of
categories.)
Creating the icon image In addition to
the HTML file, objects on the Objects panel need a GIF image for the
icon. If no image is created or if the image cannot be found,
Dreamweaver will find the default image (generic.gif). Follow these
steps to create the GIF image:
1
In
an image editor (such as Fireworks or Freehand), create a file
or canvas with the dimensions of 18 x 18 pixels.
Note: If the
image is not 18 x 18 pixels in size, Dreamweaver will scale
the image to 18 x 18 pixels for use in the Objects
panel.
2
Design the icon.
3
Open the
Save As or Export dialog box.
4
Name the image the same name as the HTML file (minus
the .htm or .html extension). For example, if the HTML file is
named "my_object.html," then your GIF file name will have to
be "my_object.gif."
5
Save or
export the GIF file into the same folder in which you saved
the HTML
file.
Using your new
object If you just saved the HTML file and Dreamweaver is still open,
restart Dreamweaver. Or, you can Control-click (Option-click for Macintosh) the
categories pop-up menu at the top of the Objects panel and then select
Reload Extensions in the categories list (see Example 3).
Additional
information Objects can be packaged
and distributed on the Macromedia Exchange. For more information, see the
Macromedia Exchange for Dreamweaver site. The Extension
Manager is required to package extensions and is available for download
from the site.
